// https://github.com/chriskempson/tomorrow-theme

@require "theme"

// Placeholder: $code-block
$code-block {
  overflow: auto;
  margin: 20px 0;
  //padding: 15px;
  font-size $code-font-size;
  color: $highlight-foreground;
  background: $highlight-background;
  line-height: $line-height-code-block;
}

pre, code { font-family: $code-font-family; }

code {
  padding: 2px 4px;
  word-break: break-all;
  color: $code-foreground;
  background: $code-background;
  border-radius: $code-border-radius;
  font-size $code-font-size;
}

pre {
  @extend $code-block;

  code {
    padding: 0;
    color: $highlight-foreground;
    background: none;
    text-shadow: none;
  }
}

.highlight {
  @extend $code-block;

  pre {
    border: none;
    margin: 0;
    padding: 24px;
    line-height: 1.4;
  }

  table {
    margin: 0;
    //width: auto;
    //border: none;
    border: 1px solid #E8E8E8;
    border-radius: 0 0 3px 3px;
  }

  td {
    border: none;
    padding: 0;
  }

  figcaption {
    clearfix();
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    height: 28px;
    background: #E7E7E7;
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    .ctrl-left{
      margin: auto 8px auto 12px;
      cursor:pointer;
    }
    .ctrl-title{
      margin: auto 8px auto 12px;
      font-weight:bold;
    }
    .ctrl-right{
      color: #a4a4a4;
      position: absolute;
      right: 12px;
      top: 3px;
      font-weight:bold;
    }

    a {
      float: right;
      color: $highlight-foreground;

      &:hover { border-bottom-color: $highlight-foreground; }
    }
  }

  .gutter pre {
    color: $grey-dim;
    text-align: right;
    padding-right: 20px;
  }

  .line { height: 20px; }
}


.gist table {
  width: auto;

  td { border: none; }
}

pre {

  .comment { color: $highlight-comment; }

  .variable
  .attribute
  .tag
  .regexp
  .ruby .constant
  .xml .tag .title
  .xml .pi
  .xml .doctype
  .html .doctype
  .css .id
  .css .class
  .css .pseudo {
    color: $highlight-red;
  }

  .number
  .preprocessor
  .built_in
  .literal
  .params
  .constant
  .command {
    color: $highlight-orange;
  }

  .ruby .class .title
  .css .rules .attribute
  .string
  .value
  .inheritance
  .header
  .ruby .symbol
  .xml .cdata
  .special
  .number
  .formula {
    color: $highlight-green;
  }

  .title
  .css .hexcolor {
    color: $highlight-aqua;
  }

  .function
  .python .decorator
  .python .title
  .ruby .function .title
  .ruby .title .keyword
  .perl .sub
  .javascript .title
  .coffeescript .title {
    color: $highlight-blue;
  }

  .keyword
  .javascript .function {
    color: $highlight-purple;
  }

}
